<template>
	<view class="container">
		<view class="head">
			<image :src="userinfo.avatar" mode=""></image>
			<text>{{userinfo.username}}</text>
		</view>
		<view class="content">
			<view class="content_in">
				<view class="title">
					<h3>我的应用</h3>
				</view>
				<view class="menu">
					<view class="menuin" v-for="(item,index) in list" :key="index" @click="toapp(item.url)">
						<image :src="item.img" mode=""></image>
						<text>{{item.name}}</text>
					</view>

				</view>
				<view class="btn" @click="layout">
					<button>退出登录</button>
				</view>
			</view>

		</view>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				userinfo: uni.getStorageSync("userinfo"),
				list: [{
						name: '修改密码',
						img: "../../static/img/password.png",
						url: '/pages/changepwd/changepwd',
					},
					// {
					// 	name:'运力数据',
					// 	img:"../../static/img/data.png",
					// 	url:'/pages/cardata/cardata',
					// },
					// {
					// 	name: '我的合同',
					// 	img: "../../static/img/zhanghu.png",
					// 	url: '/pages/mycontract/mycontract',
					// },
					// {
					// 	name: '查看车费',
					// 	img: "../../static/img/money.png",
					// 	url: '/pages/carmoney/carmoney',
					// },
					// {
					// 	name: '增加车费审核',
					// 	img: "../../static/img/data.png",
					// 	url: '/pages/add-fare-list/add-fare-list',
					// },
					{
						name: '车费审核',
						img: "../../static/img/data.png",
						url: '/pages/i2/freight_approve/freight_approve',
					},
					{
						name: '协议管理',
						img: "../../static/img/zhanghu.png",
						url: '/pages/i2/agreement/train_list/train_list',
					},
				]
			};
		},
		onReady() {
			//动态修改状态栏的颜色
			uni.setNavigationBarColor({
				frontColor: '#fff',
				backgroundColor: '#1890FF'
			})
		},
		onLoad() {

		},
		methods: {
			//退出登录
			layout() {
				uni.showModal({
					title: '退出登录',
					content: '是否退出登录？',
					success: res => {
						if (res.confirm) {
							uni.clearStorageSync()
							setTimeout(res => {
								uni.redirectTo({
									url: "/pages/login/login"
								})
							}, 1000)
						} else if (res.cancel) {
							console.log("取消退出登录")
						}
					}
				})

			},
			//跳转应用
			toapp(data) {
				uni.navigateTo({ url: data })
			}
		}
	}
</script>

<style lang="scss">
	.container {

		.head {
			display: flex;
			align-items: center;
			background: url("../../static/img/bg.png") no-repeat;
			background-size: 100% 100%;
			padding: 20rpx;
			height: 300rpx;

			text {
				font-size: 38rpx;
				color: #fff;
				margin-left: 40rpx;
			}

			image {
				border: #fff 2px solid;
				width: 128rpx;
				height: 128rpx;
				border-radius: 50%;
			}
		}

		.content {
			padding: 0 20rpx;
			margin-top: -80rpx;

			.content_in {
				background-color: #fff;
				border-radius: 10rpx;
				padding: 80rpx 110rpx;

				.title {
					display: flex;
					justify-content: center;

					h3 {
						font-size: 40rpx;
					}
				}

				.menu {
					display: flex;
					justify-content: space-between;
					flex-wrap: wrap;

					.menuin {
						margin-top: 120rpx;
						display: flex;
						flex-direction: column;
						align-items: center;
						width: 40%;

						image {
							width: 140rpx;
							height: 140rpx;
						}

						text {
							font-size: 32rpx;
							font-weight: 500;
							margin-top: 40rpx;
						}
					}
				}
			}

			.btn {
				margin-top: 60rpx;
				display: flex;
				justify-content: center;

				button {
					background: #1890FF;
					width: 600rpx;
					border-radius: 25rpx;
					color: #fff;
				}
			}
		}

	}
</style>